import React from 'react'

import { connect } from 'react-redux'
import {Route, withRouter} from 'react-router-dom'
import Loadable from 'react-loadable'

import 'component/common.scss'

import BottomBar from '../BottorBar/BottomBar.jsx'
import Home from '../Home/Home.jsx'
import Order from '../Order/Order.jsx'
// import My from '../My/My.jsx'
import Loading from './Loading.jsx'

const My = Loadable({
    loader: () => import(/*webpackChunkName: "my" */'../My/My.jsx'),
    loading: Loading
})

class Main extends React.Component {
    constructor(props){
        super(props)
    }
    // loadMy(location, cb){
    //     import(/*webpackChunkName: "my"*/'../My/My.jsx').then(component => {
    //         cb(null, component.default)
    //     })
    // }
    render() {
        return ( 
            <div>
                <Route exact path='/home' component={Home} />
                <Route path='/order' component={Order} />
                <Route path='/my' component={My} />
                <BottomBar /> 
            </div>
        )
    }
}

export default withRouter(connect()(Main))